<template>
	<view class="content">
		<view class="bgimg">
			<!-- 头部 -->
			<!-- <view class="header" style="padding-top: 50rpx;">
				<uni-nav-bar background-color="transparent" left-icon="back" 
				 title="个人中心" color='#ffffff' @clickLeft="back" ></uni-nav-bar>
			</view> -->
			<!-- <image src="../../static/img/our/5.png" mode="" lazy-load=""></image> -->
		</view>
		<!-- 个人信息-->
		<view class="our">
			<view class="left">
				<image :src="our_data.user_headimg" mode=""></image>
			</view>
			<view class="right">
				<view class="name">
					{{our_data.nick_name}}
					<image src="../../static/img/our/编辑.png" mode="scaleToFill" @tap="Modify"></image>
				</view>
				<view class="phone">
					{{our_data.user_tel}}
				</view>
			</view>
		</view>
		<!-- 个人中心列表 -->
	    <view class="our_list">
	    	<view class="li" v-for="(item,index) in list" @tap="select_url(item.url)">
	    		<view class="left">
	    			<image :src="item.img" mode=""></image>
	    		</view>
				<view class="right">
					{{item.title}}
				</view>
				<view class="right" style="padding-left: 200rpx;">
					{{item.phone}}
				</view>
	    	</view>
	    </view>
		<!-- <view class="bot">
			<view class="left" @tap='index'>
				<image src="../../static/tab/index.png" mode=""></image>
			    <view class="title">
			    	首页
			    </view>
			</view>
			<view class="row">
				
			</view>
			<view class="left">
				<image src="../../static/tab/user.png" mode=""></image>
			    <view class="title active">
			    	我的
			    </view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				our_data:{},
				list:[
					{
						title:'我的优惠券',
						url:'../coupon/coupon',
						img:'../../static/img/our/11.png',
						phone:''
					},
					{
						title:'地址管理',
						url:'../address/address',
						img:'../../static/img/our/12.png',
						phone:''
					},
					{
						title:'我的订单',
						url:'../order/order',
						img:'../../static/img/our/13.png',
						phone:''
					},
					{
						title:'联系客服',
						url:'',
						img:'../../static/img/our/7.png',
						phone:''
					},
					// {
					// 	title:'设置',
					// 	url:'../set_up/set_up',
					// 	img:'../../static/img/our/14.png',
					// 	phone:''
					// },
					{
						title:'关于我们',
						url:'../Buy_again/Buy_again',
						img:'../../static/img/our/13.png',
						phone:''
					}
					
				]
			}
		},
		onShow() {
			var uid=uni.getStorageSync('uid');
			this.getData({Uid:uid})
		},
		methods: {
			select_url(url){
				if(url==''){
					uni.makePhoneCall({
						// 手机号
						    phoneNumber: '15388941116', 
							// 成功回调
							success: (res) => {
								console.log('调用成功!')	
							},
							// 失败回调
							fail: (res) => {
								console.log('调用失败!')
							}
					})
				}
				uni.navigateTo({
					url:url
				})
			},
			Modify(){
			 uni.navigateTo({
			 	url:'../Modify_info/Modify_info'
			 })
			},
			//获取个人中心数据
			getData(Uid){
				this.infoprop('/Member/index', 'POST',Uid, (res) => {
					this.our_data=res.data.data;
					this.list[3].phone=res.data.data.Service;
					console.log(this.our_data)
				})
			},
			phone(){
				
			},
			index(){
				uni.navigateTo({
				   url: '../index/index'
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		//大图
		.bgimg{
			width: 100%;
			height: 400rpx;
			background: url(../../static/img/our/5.png) no-repeat;
			background-size: 100% 100%;
		}
		//个人中心
		.our{
			width:95%;
			height:300rpx;
			background:rgba(255,255,255,1);
			box-shadow:0px 3px 9px 0px rgba(0, 0, 0, 0.06);
			border-radius:20px;
			display: flex;
			margin: auto;
			margin-top: -50%;
			transform: translate(0,50%);
			align-items: center;
			.left{
				padding-left: 50rpx;
				image{
					width: 200rpx;
					height: 200rpx;
				}
			}
			.right{
				padding-left: 50rpx;
				.name{
					font-size:40rpx;
					font-family:PingFang SC;
					font-weight:500;
					color:rgba(0,0,0,1);
					display: flex;
					image{
						width: 50rpx;
						height: 50rpx;
						margin-left: 20rpx;
					}
				}
				.phone{
					padding-top: 30rpx;
					font-size:35rpx;
					font-family:PingFang SC;
					font-weight:500;
					color:rgba(73,72,72,1);
				}
			}
		}
	   //个人中心列表
	   .our_list{
		   margin-top: 200rpx;
		   .li{
			   display: flex;
			   border-bottom: 1px solid rgba(238,238,238,1);
			   padding: 30rpx 50rpx;
			   .left{
				   image{
					   width: 50rpx;
					   height: 50rpx;
				   }
			   }
			   .right{
				   font-size:30rpx;
				   font-family:PingFang SC;
				   font-weight:500;
				   color:rgba(73,72,72,1);
				   padding-left: 50rpx;
			   }
		   }
	   }
	   .bot{
		   display: flex;
		   position: fixed;
		   bottom: 0rpx;
		   justify-content: space-around;
		   align-items: center;
		   width: 100%;
		   background-color: #FFFFFF;
		   font-size: 25rpx;
		   text-align: center;
		   .left{
			   padding: 20rpx 0;
			   image{
				   width: 50rpx;
				   height: 50rpx;
			   }
			   .active{
				   color: #0081FF;
			   }
		   }
	   }
	}

</style>
